/*
new APP(名称, X坐标, Y坐标)
注意：名称要对应window.apps和window.defines。
*/
class App {
    constructor(name, x, y) {
        this.name = name;
        this.x = x;
        this.y = y;
        this.moving = false;
        this.moveListener = this.moveListener.bind(this);
        this.upListener = this.upListener.bind(this);
        this.time = 0;
        this.set = false;
        this.clickOnce = false;
        this.lastClick = 0;
    }
    /**
     * render: 渲染元素。
     * @returns {HTMLDivElement}
     */
    render(){
        if(!window.apps) return;
        if(!window.apps[this.name]) return;
        var row = document.querySelectorAll('#apps tr')[this.y+1];
        if(!row) return;
        var col = row.querySelector('td:nth-child('+(this.x+1)+')');
        if(!col) return;
        var div = document.createElement('div'),
            img = document.createElement('img'),
            title = document.createElement('span');
        img.src = window.apps[this.name].favicon;
        img.setAttribute('draggable', 'false');
        title.className = 'input';
        title.innerText = window.apps[this.name].name;
        div.className = 'app';
        div.dataset.appid = this.name;
        div.style.position = 'relative';
        div.append(img, title);
        col.append(div);
        this.col = col;
        this.elem = div;
        this.bindEvents();
        return div;
    }
    /**
     * bindEvents: A Function That Binds Events To An Object.
     */
    bindEvents(){
        this.elem.addEventListener("mousedown", (e)=>{
            if(!e.target.closest("textarea, .input")){
                this.moving = true;
            }
            this.set = false;
            this.time = Date.now();
        });
        window.addEventListener("mousemove", this.moveListener);
        window.addEventListener("mouseup", this.upListener);
    }
    beforeRemove(){
        window.removeEventListener("mousemove", this.moveListener);
        window.removeEventListener("mouseup", this.upListener);
    }
    /**
     * moveListener: mousemove的事件监听器
     * @param {MouseEvent} e 
     */
    moveListener(e){
        if(this.moving && (Date.now() - this.time) > 600){
            if(!this.set) {
                this.elem.style.position = 'absolute';
                document.body.append(this.elem);
            }
            this.set = true;
            this.elem.style.left = e.pageX - this.elem.offsetWidth / 2 + 'px';
            this.elem.style.top = e.pageY - this.elem.offsetHeight / 2 + 'px';
        }
    }
    /**
     * upListener: mouseup的事件监听器
     * @param {MouseEvent} e
     */
    upListener(e){
        var lc = this.lastClick;
        
        this.lastClick = Date.now();
        if((Date.now() - this.time) <= 300){
            if(this.clickOnce){
                console.log(Date.now(), lc);
                if((Date.now() - lc) <= 400){
                    if(!e.target) return;
                    else if(e.target.closest("textarea")) null;
                    else if(e.target.closest(".input") && window.dblClickApp) window.dblClickApp(e);
                    else{
                        var app = e.target.closest("[data-appid]");
                        if(!app) return;
                        var name = app.dataset.appid;
                        app = null;
                        if(window.defines && window.defines[name]){
                            var tool = window.defines[name];
                            if(typeof tool !== 'function') return;
                            tool();
                        }
                    }
                    this.clickOnce = false;
                }
            }else{
                this.clickOnce = true;
            }
            console.log(this.clickOnce);
        }
        if(!this.moving) return;
        this.moving = false;
        var elements = Array.from(document.elementsFromPoint(this.elem.offsetLeft, this.elem.offsetTop));
        var elem = elements[elements.findIndex(x=>x.tagName.toUpperCase()==='TD')];
        this.elem.style.position = 'relative';
        this.elem.style.left = '0';
        this.elem.style.top = '0';
        if(elem && elem.children.length < 1){
            elem.append(this.elem);
            this.col = elem;
        }else{
            this.col.append(this.elem);
        }
        this.moving = false;
    }
}

export default App;